<template>
  <div id="app">
    <NavBar v-if="$route.path !== '/login'" />
    <main class="main-content">
      <router-view />
    </main>
  </div>
</template>

<script>
import { onMounted } from 'vue'
import { useAuthStore } from './store/auth'
import NavBar from './components/NavBar.vue'

export default {
  name: 'App',
  components: {
    NavBar
  },
  setup() {
    const authStore = useAuthStore()

    onMounted(() => {
      authStore.checkAuth()
    })
  }
}
</script>

<style>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.main-content {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

/* 确保所有表单输入框宽度一致 */
.el-form-item__content {
  width: 100%;
}

.el-input,
.el-textarea,
.el-select {
  width: 100%;
}

/* Ace Editor 样式调整 */
.ace_editor {
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
  font-size: 14px;
  line-height: 1.5;
}

.ace_content {
  width: 100% !important;
}

.ace_scroller {
  width: 100% !important;
}
</style>
